<template>
    <view class="personal  whiteBackground">
		<!-- 头部  -->
		<headTop ref="header"
			:showReturn='false'
			:parent_name= "currentCustomer.stu_name"
			:header_content="header_content"
			:header_title="header_title"
			:avatar="avatar"
		></headTop>

		<div class="option_wraper">
			<view class="options shadow">
				<view @click="switch_invite(true)" class="option" v-if="showQR">
					<image class="qrcode icon" src="/static/personal/index/qrcode.png" mode=""></image>
					<text class="f28">二维码</text>
				</view>
				<view @click="jumpTo('monthly')" class="option">
					<image class="icon" src="../../static/pre.png" mode=""></image>
					<text class="f28">成长手册</text>
				</view>
				<view @click="appraisal()" class="option">
					<image class="icon" src="../../static/course.png" mode=""></image>
					<text class="f28">宝宝测评</text>
				</view>
			</view>
		</div>

		<view class="bottom-nav">
			<view @click="jumpTo('profile')" class="content">
				<image class="icon" src="../../static/personal/index/info.png" mode=""></image>
				<text>宝宝基本信息</text>
			</view>
			<view @click="jumpTo('video')" class="content">
				<image class="icon" src="../../static/personal/index/info.png" mode=""></image>
				<text>监控充值</text>
			</view>
			<view @click="jumpTo('uchat')" class="content">
				<image class="icon" src="../../static/personal/index/baby.png" mode=""></image>
				<text class="f28">聊天室</text>
			</view>
			<view @click="jumpTo('communicate')" class="content">
				<image class="icon" src="../../static/personal/index/growth.png" mode=""></image>
				<text>意见反馈</text>
			</view>
		<!-- 	<view @click="jumpTo('bind')" class="content">
				<image class="icon" src="../../static/personal/index/setting.png" mode=""></image>
				<text class="f28">账号绑定</text>
			</view> -->
			
		</view>

		<view v-if="isLogin == true" class="login_out f28" @click="unbind" style="margin-bottom: 20rpx;">
				<!-- <image class="icon" src="../../static/personal/index/setting.png" mode=""></image> -->
				<text class="f28" style="color: #FF0000;">解绑微信</text>
		</view>


		<dialog-box :dialog_name="dialogTitle" :dialog_content="dialogCotent" :dialog_btn="dialogBtn" :inshow_box="dialogShow" @closeDialogBox="closeDialogBox"></dialog-box>

		<view @tap="switch_invite(false)" class="my_popup_wd_box" :class="{my_on:switch_pw}">
			<view class="my_empty-box" id="qrCode" ref="qrCodeDiv" @longpress="saveQrcode">
				<tki-qrcode
				ref="qrcode"
				:val="val"
				:size="size"
				:unit="unit"
				:background="background"
				:foreground="foreground"
				:pdground="pdground"
				:iconSize="iconsize"
				:onval="onval"
				:loadMake="loadMake"
				@result="qrR" />
			</view>
			<view class="qr-tips">二维码可用于签到</view>
		</view>
		<view class="copyright-box">
			<copyRight></copyRight>
		</view>
	</view>
</template>

<script>
import headTop from "../component/head-top.vue"
import dialogBox from '../component/dialog.vue'
import copyRight from '../../components/copyright.vue'
// var AES = require("@/utils/cryptojs/aes.js");
// var ENC = require("@/utils/cryptojs/enc-utf8.js");
// var ENC64 = require("@/utils/cryptojs/enc-base64.js");

export default {
	components:{
		headTop,
		dialogBox,
		copyRight,

	},
    data() {
		return {
			isLogin:uni.getStorageInfoSync('isLogin'),
			close_care_weekly:null,
			switch_pw:false,
			header_content: '欢迎和我们呵护萌宝的成长',
			header_title: '个人中心',
			userInfo : {},
			currentCustomer : {},
			dialogTitle : '',
			dialogCotent : '',
			dialogShow : false,
			dialogBtn : '',
			isSuper : 0,
			avatar : this.config.DEFAULT_CUSTOMER_AVATAR,
			showContract:false,
			showParentPage:true,
			closeAppraise:true,

			val:"", // 要生成的二维码值,
			size: 470, // 二维码大小
			unit: 'upx', // 单位
			background: '#ffffff', // 背景色
			foreground: '#000000', // 前景色
			iconsize: 45, // 二维码图标大小
			onval: false, // val值变化时自动重新生成二维码
			loadMake: false, // 组件加载完成后自动生成二维码
			qrSrc: '' ,// 二维码生成后的图片地址或base64
			showQR : true,
		}
    },
	onLoad() {
		this.getSchoolSetting();
		// console.log('175', this.close_care_weekly)
	},
	onShow() {
		this.userInfo = getApp().globalData.userInfo;
		if(getApp().globalData.currentCustomer){
			this.currentCustomer = getApp().globalData.currentCustomer;
		}
		this.val = this.currentCustomer.stu_id
		

	},
    methods: {
		// 点击弹出二维码弹窗
		switch_invite(switch_status) {
			if (switch_status) {
				this.switch_pw = true;
				this.creatQrcode();
			} else {
				this.switch_pw = false;
			}
		},
		creatQrcode() {
			this.$refs.qrcode._makeCode()
		},
		saveQrcode(e) {
			console.log(e)
			this.$refs.qrcode._saveCode()
		},
		qrR(res) {
			this.qrSrc = res
		},
		getSchoolSetting(){
			
		},
			closeDialogBox() {
				this.dialogShow = false;
			},
			// 退出登录
			loginOut() {
				uni.showLoading({
					title: '加载中',
					icon: 'loading'
				});
				this.common.http.request('/api/v1/auth/login/out', 'post', {}, (res) => {
					if (res.data.code == 0) {
						uni.hideLoading();
						if (res.data.data !== null) {
							uni.showToast({
								title: '退出成功',
								icon: 'none'
							});
							uni.clearStorage();
							uni.navigateTo({
								url: '../login/login'
							})
						}
					}
				})
			},
			jumpTo(target) {
				

				// switch(target){
				// 	case 'activity' : uni.navigateTo({url:'../education/activity/preActive'});break;
				// 	case 'course' : uni.navigateTo({url:'../education/timeTable/timeTable'});break;
				// 	case 'contract' : uni.navigateTo({url:'contract/contract'});break;
				// 	case 'order' : uni.navigateTo({url:'../index/video/video-order'});break;
				// 	case 'profile' : uni.navigateTo({url:'profile/profile'});break;
				// 	// case 'notice' : uni.navigateTo({url:'/pages/index/notice/notice'});break;
				// 	 case 'sign_month' : uni.navigateTo({url:'/pages/index/sign_list/sign_list'});break;
				// 	 case 'notice' : uni.navigateTo({url:'/pages/index/dynamic/dynamic'});break;
				// 	case 'growup' : uni.navigateTo({url:'../index/growup/growup-view'});break;
				// 	case 'weekly' : uni.navigateTo({url:'../index/diary/diary'});break;
				// 	case 'school' : uni.navigateTo({url:'school/school'});break;
				// 	case 'pickup' : uni.navigateTo({url:'/pages/index/sign-in/sign-in-surrogate'});break;
				// 	case 'appointment' : uni.navigateTo({url:'/pages/personal/appointment/appointment'});break;
				// 	case 'switch' : uni.navigateTo({url:'switch/switch'});break;
				// 	case 'communicate' : uni.navigateTo({url:'../index/home/home'});break;
				// 	case 'visit_sign' : uni.navigateTo({url:'../index/sign-in/sign-in-visiter'});break;
				// 	case 'monthly' : uni.navigateTo({url:'../education/monthly/reportsList'});break;
				// 	case 'bracelet' : uni.navigateTo({url:'/pages/education/braceletInfo/braceletInfo'});break;
				// 	case 'bind' : uni.navigateTo({url:'bind/add'});break;
				// 	case 'video': uni.navigateTo({url:'/pages/personal/topup/topupList'});break
				// 	case 'uchat': 
				// 		if(this.currentCustomer.class_id == 0) {
				// 			uni.showToast({
				// 				icon:'error',
				// 				title:'未加入班级'
				// 			})
				// 		}else {
				// 			uni.navigateTo({url:'/pages/personal/uchat/uchat'})
				// 		}
				// 	;break
				// }
				// this.dialogShow = false;
			},
			appraisal(){
				uni.navigateTo({
					url:'appraisal/appraisal'
				})
			},
			messageManager () {
				uni.openSetting({
				  success(res) {
				    console.log(res.authSetting)
				  }
				});
			},
			switchAccount(){
				let open_id = getApp().globalData.userInfo.open_id;
				getApp().globalData.userInfo = '';
				getApp().globalData.currentCustomer = '';
				getApp().globalData.access_token = '';
				getApp().globalData.isSuper = '';
				uni.reLaunch({
					url:'../login/manager-login?open_id='+open_id
				})
			},
			unbind(){
				console.log(getApp().globalData.userInfo,'open_id')
				let that = this;
				uni.showModal({
					content:'您正在进行解除绑定微信，请确认是否继续进行解除，点击取消返回，点击确认将会解除绑定并退出登陆',
					success : res => {
						if(res.confirm) {
							// let open_id = getApp().globalData.userInfo.open_id;
							// getApp().globalData.userInfo = '';
							// getApp().globalData.currentCustomer = '';
							// getApp().globalData.access_token = '';
							// getApp().globalData.isSuper = '';
							// uni.reLaunch({
							// 	url:'../login/login-wx?open_id='+open_id
							// })

							uni.showLoading({
								title:'解绑中，请稍后'
							})
							let param = {
								open_id:getApp().globalData.userInfo.open_id
							}
							console.log(getApp().globalData.userInfo.open_id);
							that.common.http.request('/wx/auth/solve/bind','POST',param,res => {
								if(res.data.code == 0){
									let open_id = getApp().globalData.userInfo.open_id;
									getApp().globalData.userInfo = '';
									getApp().globalData.currentCustomer = '';
									getApp().globalData.access_token = '';
									getApp().globalData.isSuper = '';
									uni.reLaunch({
										url:'../login/login-wx?open_id='+open_id
									})
									uni.hideLoading()
								}
							})
						}
						if(res.cancel) {

						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>

    .login_out {
			box-shadow:3rpx 3rpx 10rpx 3rpx #eee;
			margin: 32rpx 30rpx 0;
			height: 98rpx;
			line-height:98rpx;
			text-align: center;
    }
	.content{
		display: flex;
		box-sizing: border-box;
		height: 98rpx;
		align-items: center;
		.icon{
			margin-right: 25rpx;
			width: 32rpx;
			height: 32rpx;
		}
	}
	.option_wraper{
		height: 200rpx;
		display: flex;
		justify-content: center;
		.options{
			background: #fff;
			position: absolute;
			top: 312rpx;
			left: 0;
			width: 690rpx;
			height:  164rpx;
			margin: 30rpx;
			padding: 10rpx;
			border-radius: 14rpx;
			display: flex;
			justify-content:space-between;
			align-items: center;
			.option{
				height: 108rpx;
				width: 115rpx;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				.icon{
					width: 40rpx;
					height: 48rpx;
				}
				.qrcode{
					width: 48rpx;
				}
				.f28{
					margin-top: 10rpx;
				}
			}
		}
	}

    .matters-box {
        box-shadow: 2px 2px 2px 2px #eee;
        width: 92%;
        margin: 0 auto;
        .top {
            display: flex;
            align-items: center;
            padding: 10px 0 10px 10px;
            image {
                width: 15px;
                height: 24px;
                margin-right: 10px;
            }
            text {
                font-size: 17px;
                font-family: PingFangSC-Semibold, PingFang SC;
                font-weight: 600;
                color: rgba(51, 51, 51, 1);
            }
        }

        .bottom-box {
            display: flex;
            justify-content: space-around;
            padding-bottom: 10px;
            .img-box {
							width: 50px;
							height: 50px;
							background: rgb(237, 130, 127);
							border-radius: 100%;
							display: flex;
							justify-content: center;
							align-items: center;

							image {
								width: 30px;
								height: 30px;
							}
            }
            .pu_text {
							text-align: center;
							.first {
								font-size: 14px;
								font-family: PingFangSC-Regular, PingFang SC;
								font-weight: 400;
								color: rgba(51, 51, 51, 1);
								display: block;
							}
							.second {
								font-size: 11px;
								font-family: PingFangSC-Regular, PingFang SC;
								font-weight: 400;
								color: rgba(51, 51, 51, 1);
							}
            }
        }
    }

    .bottom-nav {
			margin: 200rpx 30rpx 0;
			box-shadow:0 0 20rpx 0 #eee;
			border-radius:14rpx;
			padding: 30rpx;
    }

		.baby{
			margin:3rpx 30rpx 0;
			box-shadow: 4rpx 4rpx 4rpx 4rpx #eee;
			padding: 0 0 0 30rpx;
		}
   .my_popup_wd_box {
   	background-color: rgba(0, 0, 0, 0.8);
   	display: flex;
   	justify-content: center;
   	flex-direction: column;
   	align-items: center;
   	.my_empty-box {
   		width: 280px;
   		height: 280px;
   		display: flex;
   		justify-content: center;
   		flex-direction: row;
   		align-items: center;
		background-color: #fff;
		border-radius: 10rpx;
   		image{
   			width: 100%;
   			// height: 100%;
   		}
   	}
   	.qr-tips{
   		margin-top: 30rpx;
   		color: #FFFFFF;
   	}
   }

	.copyright-box{
		// margin-bottom:20rpx;
		margin-bottom: 120rpx;
	}
</style>
